<h1>Stranice</h1>

<div class="left" style="width:200px;padding-right:10px;border-right:1px dotted #aaa;">
    <p class="actions">
        <a href="javascript:void(0)" title="Kreiraj Kategoriju" onclick="newCategory()" class="add">+ Kategorija</a>
        <a href="javascript:void(0)" title="Kreiraj Pod Kategoriju" onclick="newSubCategory()" class="add sub category-selected">+ PodKategorija</a>
        <a href="javascript:void(0)" title="Izmeni Kategoriju" onclick="editCategory()" class="edit category-selected">Izmeni</a>
        <a href="javascript:void(0)" title="Obriši Kategoriju" onclick="deleteCategory()" class="delete category-selected">- Kategorija</a>
    </p>
    <?= $this->element('category_tree') ?>
</div>

<? if (! empty($selected_category)): ?>
<table class="left entity-table" style="margin-left:20px;width:600px">
    <tr>
        <th width="2%">Šifra</th>
        <th>Naslov</th>
        <th width="15%" class="text-right actions">
            <?= $this->Html->link(' ', '/admin_pages/create/' . $selected_category, array(
                'class' => 'add',
                'title' => 'Kreiraj Stranicu'
            )) ?>
        </th>
    </tr>
    <? if (!empty($pages)): ?>
        <? foreach ($pages as $page): ?>
        <?php
            $pageId    = $page['Page']['id'];
            $pageTitle = $page['Page']['title'];
        ?>
        
        <tr>
            <td><?= sprintf("%04d", $pageId) ?></td>
            <td><?= $this->Html->link($pageTitle, '/admin_pages/edit/' . $pageId) ?></td>
            <td class="text-right">
                <?= $this->Html->link('obriši', '/admin_pages/remove/' . $pageId, array(
                    'confirm' => 'Da li želite da obrišete stranu "' . $pageTitle . '"?'
                )) ?>
            </td>
        </tr>
        <? endforeach ?>
    <? else: ?>
    <tr><td colspan="3">Nema stranica.</td></tr>
    <? endif ?>
</table>
<? endif ?>

<script type="text/javascript">

var speed     = 'fast';
var chrClosed = '&#x25B6';
var chrOpened = '&#x25BC;'


$(function(){
    var selectedCategory = parseInt('<?= $selected_category ?>');
    if (! selectedCategory) {
        $('.category-selected').hide();
    }
    
    initTree($('ul.tree.level-0'));
    
    var selectedLi = $('.tree li.selected');
    if (selectedLi.length) {
        
        var parent = selectedLi.parent();
        while(parent.hasClass('tree')) {
            parent.show();
            parent.siblings('.toggle').html(chrOpened);
            parent = parent.parent().parent()
        }
    }
});

function initTree(ul) {
    
    var togg, ul2;
    ul.children('li').each(function() {
        ul2 = $(this).children('ul');
        if (ul2.length) {
            togg = $('<a href="javascript:void(0)" class="toggle">' + chrClosed + '</a>');
            
            togg                
                .click(function(){
                    var subUl = $(this).siblings('ul');
                    
                    if (subUl.is(':visible')) {
                        subUl.slideUp(speed);
                        $(this).html(chrClosed);
                    } else {
                        subUl.slideDown(speed);
                        $(this).html(chrOpened);
                    }
                })
                .prependTo($(this));
            
            initTree(ul2);
            ul2.hide();
        }
    });
}

function saveCategory(id, name, parentId) {
    var data = {
        id:   id,
        name: name
    };
    if (parentId > 0) data['parent_id'] = parentId;
    
    $.ajax({
        url: '/admin_pages/save_category',
        data: data,
        type: 'post',
        beforeSend: function() {
            $('.tree.level-0').addClass('loading');
        },
        complete: function(req) {
            $('.tree.level-0').removeClass('loading');
            if (req.status == 200) {
                location.reload();
            } else {
                alert(req.responseText);
            }
        }
    })
}

function editCategory() {
    var id   = parseInt('<?= $selected_category ?>');
    var name = $('.tree .selected>.label').text();
    var newName = prompt('Naziv Kategorije:', name);
    if (newName && newName!=name) {
        saveCategory(id, newName);
    }
}

function newCategory(parentId) {
    var name = prompt('Naziv Kategorije:');
    if (name) {
        saveCategory(null, name, parentId);
    }
}
function newSubCategory() {
    newCategory(parseInt('<?= $selected_category ?>'))
}
function deleteCategory() {
    var name = $('.tree .selected>.label').text();;
    var id   = parseInt('<?= $selected_category ?>');
    
    if (confirm('Da li želite da obrišete kategoriju "' + name +'"\n' +
                'i sve njene podkategorije i stranice?')) {
        $.ajax({
            url: '/admin_pages/delete_category/' + id,
            beforeSend: function() {
                $('.tree.level-0').addClass('loading');
            },
            complete: function(req) {
                $('.tree.level-0').addClass('loading');
                if (req.status == 200) {
                    location.href = '/admin_pages';
                } else {
                    alert(req.responseText);
                }
            }
        })
    }
}
</script>
